<!DOCTYPE html>
<html>
<head>
	<title>Tel-O-Fun</title>

	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

	<link rel="stylesheet" href="css/greenBlack.css" />
	<link rel="stylesheet" href="css/structure.css" />
	<link rel="stylesheet" href="css/style.css" />

	<script src="js/jquery.js"></script>
	<script src="js/jquery.mobile.js"></script>
	<script src="js/list.min.js"></script>
	<script src="js/getLocation.js"></script>
	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&libraries=geometry"></script>
	<script src="js/mongoDbHandler.js"></script>
	<script src="js/Post2Facebook.js"></script>

</head>
<body>
    <div id="home" data-role="page" data-title="Home" data-theme="a"> <!-- start home page -->

        <div data-role="header"> <!-- start header -->
            <h1>Tel O-Fun</h1>
            <a href="#info"
               data-icon="info"
               data-iconpos="notext"
               data-rel="dialog"
               data-theme="a"
               class="ui-btn-right">
               Info
            </a>
        </div>

        <div data-role="content"> <!-- start home content -->
            <img class="center" src="images/tel-o-fun.png">

            <div data-role="controlgroup"> <!-- find stations button -->
                <a href="findNearestStation.html"
                   data-transition="slide"
                   data-role="button"
                   data-iconpos="right"
                   data-icon="arrow-r"
                   rel="external">
                   Nearest Tel O-Fun Station
                </a>
            </div>

            <div data-role="controlgroup"> <!-- list stations button -->
                <a href="listStations.html"
                   data-transition="slide"
                   data-role="button"
                   data-iconpos="right"
                   data-icon="arrow-r"
                   data-prefetch>
                   Stations List
                </a>
            </div>

            <div data-role="controlgroup"> <!-- post route facebook button -->
		<a	href="postRouteOnFacebook.html"
			data-transition="slide"
			data-role="button"
			data-iconpos="right"
			data-icon="arrow-r"
			data-prefetch>
				Post On Facebook
		</a>
            </div>

            <div data-role="controlgroup"> <!-- about telofun button -->
                <a href="aboutTelOFun.html"
                   data-transition="slide"
                   data-role="button"
                   data-iconpos="right"
                   data-icon="arrow-r"
                   data-prefetch>
                   About Tel O-Fun
                </a>
            </div>
            
        </div> <!-- end content -->
    </div> <!-- end home page -->

    <div id="info" data-role="page"> <!-- start info page -->

        <div data-role="header">
            <h1> About This App </h1>
        </div>

        <div data-role="content"> <!-- start info content -->
            <p>Tel Aviv-Yafo joins other large European cities in offering residents and visitors bikes for rent.
                Why walk or drive when you can ride? Now you can rent a bike in Tel Aviv! Forget about the traffic and looking for parking, and sign up to the Tel-O-Fun bike rental service.</p>

            <div style="text-align: center">
                <a href="index.html"
                   data-role="button"
                   data-inline="true"
                   data-rel="back"
                   data-transition="fade"
                   data-icon="check"
                   data-theme="a">
                   Got it!
                </a>
            </div>
        </div> <!-- end info content -->
    </div> <!-- end info page -->
    
</body>
</html>